import './style/index.css';
import React from 'react';
import { observer, inject } from 'mobx-react';
import { Button } from 'antd';
import MindStore from '../../stores/cubeMind';
import { WeaMind,WeaLocaleProvider } from "ecCom";
const getLabel = WeaLocaleProvider.getLabel;
const ButtonGroup = Button.Group;
export interface MindProps {
    cubeMind: MindStore;
}

@inject('cubeMind')
@observer
export default class MindBase extends React.Component<MindProps, any> {

    render() {
        const { cubeMind } = this.props;
        return (
            <div className="cubeMind_Container" style={{ height: "100%" }}>
                <div style={{ height: "0px" }}>
                    <WeaMind
                        onCreate={cubeMind.jsmindLoading} 
                        style={{height:"0px"}}/>
                </div>
                <div className="btnDiv">
                    <ButtonGroup size="large">
                        <Button type="ghost" onClick={cubeMind.zoomIn}>+ {getLabel(22208, '放大')}</Button>
                        <Button type="ghost" onClick={cubeMind.zoomOut}>- {getLabel(22209, '缩小')}</Button>
                        <Button type="ghost" onClick={cubeMind.expand_all}>▽ {getLabel(502282, '展开')}</Button>
                        <Button type="ghost" onClick={cubeMind.collapse_all}>△ {getLabel(83705, '收缩')}</Button>
                    </ButtonGroup>
                </div>
                <div id="jsmind_container" style={{ height: "100%" }} />
            </div>
        )
    }

    saveContracterMind = (arr, old_parent, new_parent, selectd_node) => {
        //this.editable();
        //this.initMap();
    }
}